<?xml version="1.0" encoding="ISO-8859-1" ?>

<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"
	xmlns:c="http://java.sun.com/jsp/jstl/core" version="2.0">
	<jsp:directive.page contentType="text/html; charset=ISO-8859-1"
		pageEncoding="ISO-8859-1" session="true" />
	<jsp:output doctype-root-element="html"
		doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"
		doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
		omit-xml-declaration="true" />

	<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Gamer's Community</title>
<jsp:include page="common/headerScripts.jsp" />
<link rel="stylesheet" href="${root}/css/L75R25.css" />
<script type="text/javascript">
	$(document)
			.ready(
					function() {						
						$("tr:odd").addClass("odd");
						$("#datepicker").datepicker();
						$("#form")
								.submit(
																			
										function() {
											var gid = $("#gid");
											var name = $("#name");
											var platform = $("#platform");
											var genre = $("#genre");
											var company = $("#company");
											var website = $("#website");
											var summary = $("#summary");
											var target = $("#system-message");
	<![CDATA[
											var qs = "ajax=true&id=" + gid.val() + "&name="
													+ name.val() + "&platform=" + platform.val()
													+ "&genre=" + genre.val() + "&company="
													+ company.val() + "&website=" + website.val()
													+ "&summary=" + summary.val()
													+ "&submit=Update";
											]]>	
											$
													.ajax({
														type : "POST",
														url : $("#form").attr(
																'action'),
														data : qs,
														complete : function(
																data) {
															//print results as appended   
															var response = data.responseText;
															if (response = "SUCCESS") {

																target
																		.removeClass("notdisplay");
																target
																		.append("You've successfully update the game");

															} else {
																target
																		.removeClass("notdisplay");
																target
																		.append("Failed to update the game!");

															}
														}
													});

										});
					});
</script>
</head>
<body>

	<jsp:include page="common/header_nav.jsp" />
	<!-- main starts -->
	<div id="main" class="grid-block">
		<div id="maininner" class="grid-box">
			<section id="content" class="grid-block">
				<div id="system-message" class="notdisplay">
					<dt class="message">Message</dt>
					<dd class="error message fade">
						<ul>
							<li></li>
						</ul>
					</dd>
				</div>

				<div id="system">
					<div class="items items-col-0 grid-block">
						<!-- Main Content -->

						<!-- start Main Content -->

						Game Detail page

						<form id="form" action=""
							method="post" onsubmit="return false;">
							<!-- <input type="hidden" name="ajax" value="true" /> -->
							<table id="formtable">
								<tbody>
									<tr>
										<th><label for="fname">Game Name:</label></th>
										<td><div class="input-container">
												<input type="hidden" id="gid" name="id" value="${game.id }" />
												<input type="text" id="name" name="name"
													value="${game.name }" class="required text_field" />
											</div></td>
									</tr>
									<tr>
										<th><label for="pass_confirm">Platform</label></th>
										<td><div class="input-container">
												<select id="platform" name="platform">
													<c:forEach var="i" items="${pfList }">
													<c:choose>
														<c:when test="${ i.name == game.platform }" >
														<option value="${i.name}" selected="selected">${i.name}</option>
														</c:when>
														<c:otherwise>
														<option value="${i.name}" >${i.name}</option>
														</c:otherwise>
													</c:choose>														
													</c:forEach>
												</select>
											</div></td>
									</tr>
									<tr>
										<th><label for="answer">Genre</label></th>
										<td><div class="input-container">
												<select id="genre" name="genre">
													<c:forEach var="i" items="${genreList }">
													<c:choose>
														<c:when test="${ i.name == game.genre }" >
														<option value="${i.name}" selected="selected">${i.name}</option>
														</c:when>
														<c:otherwise>
														<option value="${i.name}" >${i.name}</option>
														</c:otherwise>
													</c:choose>															
													</c:forEach>
												</select>
											</div></td>
									</tr>
									<tr>
										<th><label for="lname">Company:</label></th>
										<td><div class="input-container">
												<input type="text" id="company" name="company"
													value="${game.company }" class="text_field" />
											</div></td>
									</tr>
									<tr>
										<th><label for="lname">website:</label></th>
										<td><div class="input-container">
												<input type="text" id="website" name="website"
													value="${game.website}" class="text_field" />

											</div></td>
									</tr>
									<tr>
										<th><label for="pass">Release Date</label></th>
										<td><div class="input-container">
												<input type="text" id="datepicker" name="releaseDate"
													value="${ game.releaseDate}" class="text_field" />
											</div></td>
									</tr>
									<tr>
										<th><label for="email">summary</label></th>
										<td><div class="input-container">
												<textarea id="summary" name="summary" class="textarea_field">${game.summary}</textarea>
											</div></td>
									</tr>

									<tr>
										<td>&amp;nbsp;</td>
										<td><input type="submit" name="submit" value="Update"
											class="greenButton" /></td>
									</tr>


								</tbody>
							</table>

						</form>

						<c:if test="${not empty msg }">
							<div id="error">${msg }</div>
						</c:if>
						<c:if test="${not empty usernameError }">
							<div id="error">${usernameError}</div>
						</c:if>

						<!-- Main Content ends-->
					</div>
				</div>
			</section>
		</div>
		<!-- maininner end -->

		<jsp:include page="UserPanel.jsp" />
	</div>
	<!-- main end -->

	<jsp:include page="common/footer.jsp" />

</body>
	</html>
</jsp:root>
